﻿<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>陵县供水管网</title>
    <link rel="stylesheet" href="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/dojo/dijit/themes/claro/claro.css" />
    <link rel="stylesheet" href="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/js/esri/css/esri.css" />
    <style>
        html, body, #mapDiv {
            padding: 0;
            margin: 0;
            width: 100%;
            height: 100%;
        }
    </style>
    <script src="js/jquery-2.1.1.js"></script>
    <script src="js/json2.js"></script>
    <!-- 配置dojo环境，parseOnLoad为true 且要此句要放在 v3.3 init.js前面-->
    <script type="text/javascript">var djConfig = { parseOnLoad: true };</script>
    <script src="http://111.30.72.13/arcgis_js_api/library/3.9/3.9/init.js"></script>

    <script>
        //点击报警点时，显示相关信息  sndddx 20151119
        function getAlarm(el) {
            var maincode = el.id;
            var mainid = $('#hida' + maincode).val();
            var mainstate = $('#hidb' + maincode).val();

            if (mainstate == 0 || mainstate == "0") { mainstate = 100; }
            var dataPath = '?ZDID=' + mainid + '&ZDBH=' + maincode + '&XSZT=' + mainstate;
            var ashx = '';
            if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                ashx = 'getPoint.ashx' + dataPath;//http://222.133.60.178:809/
            }
            else {
                ashx = 'getLine.ashx' + dataPath;//http://222.133.60.178:809/
            }


            $.ajax({
                type: "GET",
                url: ashx,
                async: false,
                dataType: "jsonp",
                jsonp: "callbackparam",
                jsonpCallback: "success_jsonpCallback",
                success: function (response) {
                    console.log(response);
                    if (response.indexOf("error:") > 0) {
                        map.infoWindow.setTitle("发生错误");//设置标题
                        map.infoWindow.setContent("错误明细" + response);
                    }
                    var json = response[0];//jQuery.parseJSON(response);

                    //alert(json.JS);
                    var str = '';
                    //map.infoWindow.setTitle("地点名称： " + ss.ZDMS);//设置标题
                    if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                        str += '主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 管网主表流量:" + json.lx_324 + "<br/> 管网副表流量:" + json.lx_325 + "<br/> 管网压力:" + json.lx_326 + "<br/> 管网电瓶电压:" + json.lx_327 + "<br/> 电源电压:" + json.lx_328 + "<br/> 瞬时流量:" + json.SSLL;
                    }
                    else {
                        //xian
                        if (mainstate == 1) {
                            str += '主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 总氯（二氧化氯）:" + json.lx_328 + "<br/> 余氯:" + json.lx_329 + "<br/> 浊度:" + json.lx_330 + "<br/> PH值:" + json.lx_331;
                        }
                        else {
                            str += '主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> ORP:" + json.lx_332 + "<br/> 电导率:" + json.lx_33;
                        }
                    }
                    //map.infoWindow.show(evt.screenPoint);//启动提示框
                    //alert(str);
                    

                    //获取新的报警数据 ***********************************************
                    $.ajax({
                        type: "GET",
                        url: 'getAlarm.ashx?ZDBH=' + maincode,
                        async: false,
                        dataType: "jsonp",
                        jsonp: "callbackparam",
                        jsonpCallback: "success_jsonpCallback",
                        success: function (response1) {
                            str += "<br/><br/><br/>***********报警数据如下****************<br/><br/>";
                            console.log(response1);
                            if (response1.indexOf("error:") > 0) {
                                str += '<h1>未找到相关报警数据</h1>';
                                $('#divAlarmInfo').html(str);
                                return false;
                            }
                            alert(response1.length);
                            var attHTML = '';
                            for (var i = 0; i < response1.length; i++) {


                                var json1 = response1[i];//jQuery.parseJSON(response);
                                var attType = json1.RELA;
                                
                                switch (attType) {
                                    case "0":
                                        attHTML += '正常数值    ' + json1.XMMC + '  等于  ' + json1.SETVA1 + '<br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "1":
                                        attHTML += '正常数值    ' + json1.XMMC + '  大于  ' + json1.SETVA1 + '<br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "2":
                                        attHTML += '正常数值    ' + json1.XMMC + '  大于等于  ' + json1.SETVA1 + '<br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "3":
                                        attHTML += '正常数值    ' + json1.XMMC + '  小于  ' + json1.SETVA1 + '<br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "4":
                                        attHTML += '正常数值    ' + json1.XMMC + '  小于等于  ' + json1.SETVA1 + '<br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "5":
                                        attHTML += '正常数值    ' + json1.XMMC + '  不在  ' + json1.SETVA1 + '  和  ' + json1.SETVA2 + '  这个区间范围内 <br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                    case "6":
                                        attHTML += '正常数值    ' + json1.XMMC + '  在  ' + json1.SETVA1 + '  和  ' + json1.SETVA2 + '  这个区间范围内 <br/>';
                                        attHTML += '<b><span style="color;red;">报警数值    ' + json1.XMMC + '  等于  ' + json1.TRVA + '</span></b><br/><hr/>';
                                        break;
                                }
                                //attHTML += "<br/><br/><hr/>";

                            }


                            str += attHTML;
                          
                        },
                        error: function (ex) {
                            //alert(ex);
                            alert('fail');
                            console.log(ex);

                        }
                    });
                    //获取新的报警数据 ***********************************************

                    $('#divAlarmInfo').html(str);//获取以前做的功能 中的数据 sndddx 20151118
                },
                error: function (ex) {
                    //alert(ex);
                    alert('fail');
                    console.log(ex);

                }
            });

        }
        //报警点初始化功能，获取全部报警 点数据 
        $(document).ready(function () {


            $("#btnAllAlarm").click(function () {

                $.ajax({
                    type: "GET",
                    url: "getAllAlarm.ashx",//http://222.133.60.178:809/
                    async: false,
                    dataType: "jsonp",
                    jsonp: "callbackparam",
                    jsonpCallback: "success_jsonpCallback",
                    success: function (response) {
                        console.log(response);
                        var json = response;
                        if (json.indexOf("error") > 0) {
                            alert(response);
                            return false;
                        }
                        var str = '';
                        for (var i = 0, l = json.length; i < l; i++) {
                            var attr = {
                                "ZDBH": json[i].ZDBH,
                                "ZDID": json[i].ZDID,
                                "ZDMS": json[i].ZDMS,
                                "XSZT": json[i].XSZT
                            };
                            str += '<input type="text" id=txt' + json[i].ZDBH + ' value=' + json[i].ZBX + ',' + json[i].ZBY + ' />';
                            str += '<input type="text" id=hida' + json[i].ZDBH + ' value=' + json[i].ZDID + ' />';
                            str += '<input type="text" id=hidb' + json[i].ZDBH + ' value=' + json[i].XSZT + ' />';
                            str += '<input type="button" id="' + json[i].ZDBH + '" value=' + json[i].ZDBH + ' onclick="getAlarm(this);" /><br/><br/>';
                        }
                        $('#divAlarm').html(str);
                    },
                    error: function (ex) {
                        //alert(ex);
                        alert('fail');
                        console.log(ex);

                    }
                });





            });

        });


    </script>


    <script type="text/javascript">
        var json;
        var symbol;
        var map;
        require(["dojo/parser", "esri/geometry/Extent", "esri/Color", "esri/map", "esri/layers/ArcGISTiledMapServiceLayer",
            "esri/geometry/Point", "esri/SpatialReference", "esri/graphic", "esri/InfoTemplate", "esri/symbols/SimpleMarkerSymbol", "esri/symbols/SimpleLineSymbol", "dojo/store/JsonRest", "dojo/domReady!"],
            function (parser, Extent, Color, Map, ArcGISTiledMapServiceLayer, Point, SpatialReference, Graphic, InfoTemplate, SimpleMarkerSymbol, SimpleLineSymbol, JsonRest) {
                parser.parse();

                map = new Map("mapDiv", {
                    logo: false,
                    center: [467424.1525, 4136804.3113],
                    zoom: 2
                });
                var agoServiceURL = "http://111.30.72.13:6080/arcgis/rest/services/LXGSGWBaseMap/MapServer";
                var agoLayer = new ArcGISTiledMapServiceLayer(agoServiceURL);
                map.addLayer(agoLayer);

                var infoTemplate = new InfoTemplate("${didianming}", "${fubiaozhi}", "${guanwangyali}");
                var symbol1 = new SimpleMarkerSymbol(
                  SimpleMarkerSymbol.STYLE_CIRCLE,
                  12,
                  new SimpleLineSymbol(
                    SimpleLineSymbol.STYLE_SOLID,
                    new Color([0, 0, 255, 0.5]),
                    1
                  ),
                  new Color([0, 0, 100])
                );
                var symbol2 = new SimpleMarkerSymbol(
                  SimpleMarkerSymbol.STYLE_CIRCLE,
                  12,
                  new SimpleLineSymbol(
                    SimpleLineSymbol.STYLE_SOLID,
                    new Color([0, 255, 0, 0.5]),
                    1
                  ),
                  new Color([0, 100, 0])
                );
                var symbol3 = new SimpleMarkerSymbol(
  SimpleMarkerSymbol.STYLE_CIRCLE,
  12,
  new SimpleLineSymbol(
    SimpleLineSymbol.STYLE_SOLID,
    new Color([255, 0, 0, 0.5]),
    1
  ),
  new Color([100, 0, 0])
);


                map.on("load", addPointGraphics);

                function addPointGraphics() {
                    $.ajax({
                        type: "GET",
                        url: "http://222.133.60.178:809/getAllPoints.ashx",//http://222.133.60.178:809/
                        async: false,
                        dataType: "jsonp",
                        jsonp: "callbackparam",
                        jsonpCallback: "success_jsonpCallback",
                        success: function (response) {
                            var json = response;
                            var str = '';
                            for (var i = 0, l = json.length; i < l; i++) {
                                var attr = {
                                    "ZDBH": json[i].ZDBH,
                                    "ZDID": json[i].ZDID,
                                    "ZDMS": json[i].ZDMS,
                                    "XSZT": json[i].XSZT
                                };
                                if (json[i].ZDID < 100) {
                                    symbol = symbol1;
                                } else if (json[i].ZDID >= 100 && json[i].ZDID < 200) {
                                    symbol = symbol2;
                                } else {
                                    symbol = symbol3;
                                }
                                var loc = new Point(json[i].ZBX, json[i].ZBY, new SpatialReference(map.spatialReference));
                                var graphic = new Graphic(loc, symbol, attr, infoTemplate);
                                map.graphics.add(graphic);
                            }

                        },
                        error: function (ex) {
                            //alert(ex);
                            alert('fail');
                            console.log(ex);

                        }
                    });
                    map.graphics.on("click", g_onMouseClick);
                }
                //绑定提示框
                function g_onMouseClick(evt) {
                    if (evt.graphic.attributes) {
                        var ss = evt.graphic.attributes;

                        msg(ss, evt);

                        //map.infoWindow.setTitle("地点名称： " + evt.graphic.attributes.ZDMS);
                        //map.infoWindow.setContent("管网压力：" + evt.graphic.attributes.ZDID + "<br/>" + "副表值：" + evt.graphic.attributes.ZDBH);
                        //map.infoWindow.show(evt.screenPoint);
                    }
                }
            }
        );
        //提示框方法
        function msg(ss, evt) {
            var mainid = ss.ZDID;
            var maincode = ss.ZDBH;
            var mainstate = ss.XSZT;//元素的状态
            var data =
                {
                    ZDID: mainid,
                    ZDBH: maincode,
                    XSZT: mainstate
                };
            //alert(dataPath);
            if (mainstate == 0) { mainstate = 100; }
            mainid = 504;
            mainstate = '2 ';
            var dataPath = '?ZDID=' + mainid + '&ZDBH=' + maincode + '&XSZT=' + mainstate;
            var ashx = '';
            if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                ashx = 'http://222.133.60.178:809/getPoint.ashx' + dataPath;//http://222.133.60.178:809/
            }
            else {
                ashx = 'getLine.ashx' + dataPath;//http://222.133.60.178:809/
            }
            // alert(ashx);
            $.ajax({
                type: "GET",
                url: ashx,
                async: false,
                dataType: "jsonp",
                jsonp: "callbackparam",
                jsonpCallback: "success_jsonpCallback",
                success: function (response) {
                    console.log(response);
                    if (response.indexOf("error:") > 0) {
                        map.infoWindow.setTitle("发生错误");//设置标题
                        map.infoWindow.setContent("错误明细" + response);
                    }
                    var json = response[0];//jQuery.parseJSON(response);

                    //alert(json.JS);
                    var str = '';
                    map.infoWindow.setTitle("地点名称： " + ss.ZDMS);//设置标题
                    if ((mainid < 500 || mainid >= 600) && mainstate == 100) {
                        map.infoWindow.setContent('主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 管网主表流量:" + json.lx_324 + "<br/> 管网副表流量:" + json.lx_325 + "<br/> 管网压力:" + json.lx_326 + "<br/> 管网电瓶电压:" + json.lx_327 + "<br/> 电源电压:" + json.lx_328 + "<br/> 瞬时流量:" + json.SSLL);
                    }
                    else {
                        //xian
                        if (mainstate == 1) {
                            map.infoWindow.setContent('主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> 总氯（二氧化氯）:" + json.lx_328 + "<br/> 余氯:" + json.lx_329 + "<br/> 浊度:" + json.lx_330 + "<br/> PH值:" + json.lx_331);
                        }
                        else {
                            map.infoWindow.setContent('主键ID:' + mainid + "<br/> 设备号:" + maincode + "<br/> 记录时间:" + json.SJ + "<br/> ORP:" + json.lx_332 + "<br/> 电导率:" + json.lx_333);
                        }
                    }
                    map.infoWindow.show(evt.screenPoint);//启动提示框
                    //alert(str);
                },
                error: function (ex) {
                    //alert(ex);
                    alert('fail');
                    console.log(ex);

                }
            });

        }

    </script>
</head>
<body class="claro">
    <h3>显示所有数据库数据</h3>
    <input type="button" value="获取所有报警点" id="btnAllAlarm" />
    <div id="divAlarm">111</div>
    <div id="divAlarmInfo">info</div>
    <div id="mapDiv"></div>
    <div id="allpoints">
    </div>

</body>
</html>
